import React, { memo } from 'react'
import { NavLink } from 'react-router-dom'
import { navList } from '../../constans/header'
import './style.less'
const SubNav = () => {
  return (
    <div className="sub-nav ">
      <div className="w1100">
        <ul className="sub-nav-list flex-2">
          {navList.map((v) => (
            <li key={v.path} className="sub-nav-item">
              <NavLink
                className={(isActive: any) => {
                  return isActive
                    ? 'sub-nav-item-link active'
                    : 'sub-nav-item-link'
                }}
                to={v.path}
              >
                {v.name}
              </NavLink>
            </li>
          ))}
        </ul>
      </div>
    </div>
  )
}

export default memo(SubNav)
